<body>
  <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
  <br>
  <br>


    <div id="main-wrapper" class="container">
      <div class="row justify-content-center">
          <div class="col-xl-10">
              <div class="card border-0">
                  <div class="card-body p-0">
                      <div class="row no-gutters">
                          <div class="col-lg-6">
                              <div class="p-5">
                                  <div class="mb-5">
                                      <h3 class="h4 font-weight-bold text-theme">Login</h3>
                                  </div>

                                  <h6 class="h5 mb-0">Welcome back!</h6>
                                  <p class="text-muted mt-2 mb-5">Enter your email address and password to access admin panel.</p>

                                  <form #loginForm="ngForm">
                                      <div class="form-group">
                                          <label for="username">username</label>
                                          <input ngModel name="username" type="text" class="form-control" id="username">
                                      </div>
                                      <div class="form-group mb-5">
                                          <label for="Password">Password</label>
                                          <input ngModel name="password" type="password" class="form-control" id="password">
                                      </div>
                                      <button (click)="login(loginForm.value)" [disabled]="loginForm.invalid" type="submit" class="btn btn-theme">Login</button>
                                      <a href="#" class="forgot-link float-right text-primary">Forgot password?</a>
                                  </form>
                              </div>
                          </div>

                          <div class="col-lg-6 d-none d-lg-inline-block">
                              <div class="account-block rounded-right">
                                  <div class="overlay rounded-right"></div>
                                  <div class="account-testimonial">
                                      <h4 class="text-white mb-4">最好的用户体验!</h4>
                                      <p class="lead text-white">"仅仅三步，就可以开始美妙的购物之旅。享受全世界成千上万的精美商品！"</p>
                                      <p>- Audi Maco</p>
                                  </div>
                              </div>
                          </div>
                      </div>

                  </div>
                  <!-- end card-body -->
              </div>
              <!-- end card -->

              <p class="text-muted text-center mt-3 mb-0">Don't have an account? <a href="{{webUrl}}/register" (click)="register()" class="text-primary ml-1">register</a></p>

              <!-- end row -->

          </div>
          <!-- end col -->
      </div>
      <!-- Row -->
  </div>
</body>
